[#ftl]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>[#assign module="groups"][#assign moduleName="用户组"]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="${base}/commonjs/flexgrid/css/flexigrid.pack.css" />

<script type="text/javascript" src="${base}/commonjs/jquery1.7.2/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="${base}/commonjs/flexgrid/js/flexigrid.js"></script>
<script type="text/javascript" src="${base}/commonjs/flexgrid/js/myflexigrid.js"></script>
<script type="text/javascript" src="${base}/commonjs/artDialog4/artDialog.source.js?skin=blue"></script>
<script type="text/javascript" src="${base}/commonjs/artDialog4/plugins/iframeTools.source.js"></script>
<script type="text/javascript">
$(function(){
var grid = $(".flexme3").flexigrid(generateFlexGridCfg({
    title:'${moduleName}列表',
    url : '${base}/${module}/list/user-${item.id}',
    dataType : 'json',
    singleSelect: true,
    pageSize: 10,
    height: 200,
    colModel:[
            ["ID", "id", 40, true, "asc",  "left", null],
            ["Name", "name", 80, true, "",  "left", null],
            ["Description", "description", 100, false, "",  "left", null],
            ["Owner", "ownerid", 150, false, "",  "left", null],
            ["配置", "mm", 60, false, "",  "left", function(data, id, rowData){
                var sb = ["<a id='mm_", id, "' href='javascript:addToMy(", id, ", ", !!data, ", \"", rowData[1],  "\")' style='color: "];
                var flag = isMy(id);
                if(flag==1){
                    sb.push("blue'>申请配置");
                }else
                if(flag==-1){
                    sb.push("red'>申请取消");
                }else
                if(!!data){
                    sb.push("green'>已配置");
                }else{
                    sb.push("black'>未配置");
                }
                sb.push("</a>");
                return sb.join("")
            }]
    ]
}));
$("#btOK").click(
        function() {
            var content = [];
            var toDelete = changeLog[0];
            var toAdd = changeLog[1];
            if ((toDelete.length == 0) && (toAdd.length == 0)) {
                art.dialog.through({
                    title : "未保存${moduleName}",
                    icon : "warning",
                    content : "用户所属用户组未改变，未提交保存命令！",
                    width : 250,
                    height : 100,
                    background : '#EEE', // 背景色
                    opacity : 0.05, // 透明度
                    lock : true,
                    ok : true
                });
            } else {
                var sb;
                var ids = [];
                if (toDelete.length > 0) {
                    sb = [ "准备退出以下用户组：" ];
                    for ( var i = 0; i < toDelete.length; i++) {
                        ids.push(-toDelete[i][0]);
                        sb.push(toDelete[i].join(":"));
                        if (i < toDelete.length - 1) {
                            sb.push("，");
                        }
                    }
                    content.push(sb.join(""));
                }
                if (toAdd.length > 0) {
                    sb = [ "准备加入以下用户组：" ];
                    for ( var i = 0; i < toAdd.length; i++) {
                        ids.push(toAdd[i][0]);
                        sb.push(toAdd[i].join(":"));
                        if (i < toAdd.length - 1) {
                            sb.push("，");
                        }
                    }
                    content.push(sb.join(""));
                }
                art.dialog.confirm(content.join("<br>"), function() {
                    $.post("${base}/${module}/edit/user-${item.id}", {
                        groupIds : ids.join(",")
                    }, function(result) {
                        if (result.success) {
                            art.dialog.through({
                                title : "保存用户所属用户组成功",
                                icon : "succeed",
                                content : content.join("<br>").replace(
                                        /准备/g, "成功"),
                                width : 250,
                                height : 100,
                                background : '#EEE', // 背景色
                                opacity : 0.05, // 透明度
                                lock : true,
                                ok : function() {
                                    art.dialog.opener.window
                                            .flexGridReload(".flexme3");
                                    art.dialog.close();
                                }
                            });
                        } else {
                            art.dialog.through({
                                title : "保存用户所属用户组失败",
                                icon : "error",
                                content : result.err,
                                width : 250,
                                height : 100,
                                background : '#EEE', // 背景色
                                opacity : 0.05, // 透明度
                                lock : true,
                                ok : true
                            });
                        }
                    });

                }, function() {

                });
            }
        });
$("#btCancel").click(function() {
    art.dialog.close();
});	
});
function $1(id){
    return  $("#"+id).val()
}
function flexGridReload(selector){
    $(selector).flexReload();
}

	var changeLog = [ [],//0: to delete
	                  [] //1: to add
	];
	function showResult() {
		alert(changeLog.join("\n\n"));
	}
	function addToCache(id, data, name) {
		if (data) {
			//原本就在，无需添加到cache
			//检查一遍吧，如果有，清除掉，这是个不需要添加的
			for ( var i = 0; i < changeLog[1].length; i++) {
				if (changeLog[1][i][0] - id == 0) {
					changeLog[1].splice(i, 1);
					break;
				}
			}
		} else {
			//需要添加到cache，先看看里面有没有
			//changeLog[1].push(data)
			var found = false;
			for ( var i = 0; i < changeLog[1].length; i++) {
				if (changeLog[1][i][0] - id == 0) {
					found = true;
					break;
				}
			}
			if (!found) {
				changeLog[1].push([ id, name ]);
			}
		}
		//可能被删除过，从删除列表里清除掉
		for ( var i = 0; i < changeLog[0].length; i++) {
			if (changeLog[0][i][0] - id == 0) {
				changeLog[0].splice(i, 1);
				break;
			}
		}
	}
	function delToCache(id, data, name) {
		if (!data) {
			//原本就不在，无需添加到cache
			//检查一遍吧，如果有，清除掉，这是个不需要删除的
			for ( var i = 0; i < changeLog[0].length; i++) {
				if (changeLog[0][i][0] - id == 0) {
					changeLog[0].splice(i, 1);
					break;
				}
			}
		} else {
			//需要添加到cache，先看看里面有没有
			//changeLog[1].push(data)
			var found = false;
			for ( var i = 0; i < changeLog[0].length; i++) {
				if (changeLog[0][i][0] - id == 0) {
					found = true;
					break;
				}
			}
			if (!found) {
				changeLog[0].push([ id, name ]);
			}
		}
		//可能被添加过，从添加列表里清除掉
		for ( var i = 0; i < changeLog[1].length; i++) {
			if (changeLog[1][i][0] - id == 0) {
				changeLog[1].splice(i, 1);
				break;
			}
		}
	}
	function addToMy(id, data, name) {
		var anchor = $("#mm_" + id);
		var flag = isMy(id);
		if (flag == 1) {//临时选中要添加的，要清除之
			anchor.html("未授权").css("color", "black");
			delToCache(id, data, name);
		} else if (flag == -1) {//刚取消的，要添加上
			anchor.html("已授权").css("color", "green");
			addToCache(id, data, name);
		} else if (!!data) {//已经属于
			anchor.html("申请取消").css("color", "red");
			delToCache(id, data, name);
		} else {
			anchor.html("申请授权").css("color", "blue");
			addToCache(id, data, name);
		}
	}
	function isMy(id) {
		//目前是：1-申请加入；目前不是：-1-申请取消；看原先的：0-原先的数据是什么就是什么
		//to delete
		for ( var i = 0; i < changeLog[0].length; i++) {
			if (changeLog[0][i][0] - id == 0) {
				return -1;
			}
		}
		//to add
		for ( var i = 0; i < changeLog[1].length; i++) {
			if (changeLog[1][i][0] - id == 0) {
				return 1;
			}
		}
		return 0;
	}

	function addItem(id) {
		var url = '${base}/${module}/add';
		if (id) {
			url = '${base}/${module}/edit?id=' + id;
		}
		var mode = id ? "编辑" : "添加新";
		art.dialog.through(url, {
			title : mode + '${moduleName}',
			background : '#EEE', // 背景色
			opacity : 0.05, // 透明度
			width : 400,
			height : 300
		}).lock();
	}
	function removeItem(id) {
		art.dialog({
			content : "确定要删除该${moduleName}【id=" + id + "】？",
			title : "确认删除",
			icon : "question",
			background : '#EEE', // 背景色
			opacity : 0.05, // 透明度
			lock : true,
			button : [ {
				name : "确定",
				callback : function() {
					$.post("${base}/${module}/remove", {
						id : id
					}, function(text) {
						var result = text;
						if (result.success) {
							flexGridReload(".flexme3");
						} else {
							art.dialog({
								title : "删除失败",
								icon : "error",
								content : result.err,
								width : 400,
								height : 250,
								background : '#EEE', // 背景色
								opacity : 0.05, // 透明度
								lock : true,
								ok : true
							});
						}
					});
				}
			}, {
				name : "取消",
				focus : true
			} ]
		});
	}

</script><title>${moduleName}列表</title>
</head>
<body>
<div>${item}</div>
<table class="flexme3" style="display: none"></table>
<div><input type="button" id="btOK" value="确定"><input type="button" id="btCancel" value="取消"></div>

</body>
</html>